import 'package:flutter/material.dart';

/// 左侧资源管理器面板的“容器/停靠位”。
///
/// 特点：
/// - 子树**始终挂载**，即使收起也不会卸载（保持状态）；
/// - 展开/收起仅通过宽度动画（从 [width] → 0）；
/// - 使用 `ClipRect + Align` 裁剪内容，避免子控件在收起时溢出；
/// - 右侧分隔线通过边框绘制，并跟随透明度动画。
class ExplorerDock extends StatefulWidget {
  const ExplorerDock({
    super.key,
    required this.visible,
    required this.width,
    required this.child,
    this.showRightDivider = true,
    this.duration = const Duration(milliseconds: 220),
    this.curve = Curves.easeInOut,
  });

  /// 是否处于“展开”目标状态。
  final bool visible;

  /// 展开时的目标宽度。
  final double width;

  /// 是否显示右侧分隔线。
  ///
  /// 通过边框绘制分隔线，不占用 Row 的布局空间；
  /// 在动画中通过透明度渐变控制显隐。
  final bool showRightDivider;

  /// 展开/收起的动画时长。
  final Duration duration;

  /// 动画曲线。
  final Curve curve;

  /// 内部内容区域。
  final Widget child;

  @override
  State<ExplorerDock> createState() => _ExplorerDockState();
}

class _ExplorerDockState extends State<ExplorerDock>
    with SingleTickerProviderStateMixin {
  late AnimationController _ac;
  late Animation<double> _t;

  @override
  void initState() {
    super.initState();
    _ac = AnimationController(vsync: this, duration: widget.duration);
    _t = CurvedAnimation(parent: _ac, curve: widget.curve);

    // 初始状态同步：可见 → 宽度 1.0；不可见 → 宽度 0.0
    _ac.value = widget.visible ? 1.0 : 0.0;
  }

  @override
  void didUpdateWidget(covariant ExplorerDock oldWidget) {
    super.didUpdateWidget(oldWidget);

    // 若动画时长更新，重新赋值
    if (oldWidget.duration != widget.duration) {
      _ac.duration = widget.duration;
    }
    // 若动画曲线更新，重新构造 CurvedAnimation
    if (oldWidget.curve != widget.curve) {
      _t = CurvedAnimation(parent: _ac, curve: widget.curve);
    }
    // 处理可见性切换：展开/收起
    if (oldWidget.visible != widget.visible) {
      if (widget.visible) {
        _ac.forward();
      } else {
        _ac.reverse();
      }
    }
  }

  @override
  void dispose() {
    _ac.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _t,
      builder: (context, _) {
        // 动态宽度：目标宽度 * 动画值
        final w = widget.width * _t.value;

        // 分隔线透明度：可选，随动画渐变
        final dividerOpacity = widget.showRightDivider ? _t.value : 0.0;
        final baseOutline = Theme.of(context).colorScheme.outline;

        return SizedBox(
          width: w,
          child: Container(
            // 使用右边框绘制分隔线
            decoration: BoxDecoration(
              border: Border(
                right: BorderSide(
                  color: baseOutline.withValues(alpha: 0.08 * dividerOpacity),
                  width: 1,
                ),
              ),
            ),
            child: ClipRect(
              child: Align(
                alignment: Alignment.centerLeft,
                // 避免 widthFactor 为 0 触发布局抖动 → 设置极小值
                widthFactor: _t.value == 0 ? 0.0001 : _t.value,
                child: widget.child,
              ),
            ),
          ),
        );
      },
    );
  }
}
